<template>
  <div>
    <a-form :form="form" style="max-width: 600px; margin: 40px auto 0;" :label-col="labelCol" :wrapper-col="wrapperCol" >
      <a-form-model-item label="姓名"  aria-required="true">
        <a-input :disabled="isdisabledF" v-decorator="['professorName',{rules: [{ required: true, message: '请输入姓名', trigger: 'blur' }]}]"/>
      </a-form-model-item>

      <a-form-item label="性别" aria-required="true" >
        <j-dict-select-tag
          :disabled="isdisabledF"
          type="list"
          v-decorator="['professorSex',{rules: [{ required: true, message: '请选择性别', trigger: 'blur' }]}]"
          :trigger-change="true"
          dictCode="sex" />
      </a-form-item>

      <a-form-item  label="出生年月" aria-required="true">
        <j-date  :disabled="isdisabledF" v-decorator="['professorBirthday',{rules: [{ required: true, message: '请选择出生年月', trigger: 'blur' }]}]"  :trigger-change="true" style="width: 100%"/>
      </a-form-item>

      <a-form-item label="身份证号" aria-required="true">
        <a-input :disabled="isdisabledF" v-decorator="['professorIdentity',{rules: [{ required: true, message: '请输入身份证号', trigger: 'blur' },
                  { pattern: '^\\d{6}(18|19|20)?\\d{2}(0[1-9]|1[012])(0[1-9]|[12]\\d|3[01])\\d{3}(\\d|[xX])$',
                message: '身份证号格式不正确'}]}]"></a-input>
      </a-form-item>

      <a-form-item label="学历" aria-required="true">
        <j-dict-select-tag :disabled="isdisabledF" type="list" v-decorator="['professorEducationBackground',
        {rules: [{ required: true, message: '请选择学历', trigger: 'blur' }]}]" :trigger-change="true" dictCode="education"/>
      </a-form-item>
      <a-form-item label="学位" aria-required="true">
        <j-dict-select-tag :disabled="isdisabledF" type="list" v-decorator="['professorDegree',{rules: [{ required: true, message: '请选择学位', trigger: 'blur' }]}]" :trigger-change="true" dictCode="degree" />
      </a-form-item>

        <a-form-item label="通讯地址" aria-required="true">
          <a-input :disabled="isdisabledF" v-decorator="['professorAddress',{rules: [{ required: true, message: '请输入通讯地址', trigger: 'blur' }]}]"></a-input>
        </a-form-item>
        <a-form-item label="家庭地址" aria-required="true">
          <a-input :disabled="isdisabledF" v-decorator="['professorHomeAddress',{rules: [{ required: true, message: '请输入家庭地址', trigger: 'blur' }]}]"/>
        </a-form-item>
        <a-form-item label="健康状态" aria-required="true">
          <j-dict-select-tag :disabled="isdisabledF" type="list" v-decorator="['professorHealth',{rules: [{ required: true, message: '请选择健康状态', trigger: 'blur' }]}]" :trigger-change="true" dictCode="health" />
        </a-form-item>
      <a-form-item label="联系方式" aria-required="true">
        <a-input :disabled="isdisabledF" addon-before="办公室" v-decorator="['professorOfficeTel',{rules: [{ required: true, message: '请输入联系号码', trigger: 'blur' }, {validator:this.validatorPhones}]}]" />
      </a-form-item>
      <a-form-item label="联系方式" aria-required="true">
        <a-input :disabled="isdisabledF" addon-before="手机" v-decorator="['professorPhone',{rules: [{required: true, message: '请输入手机号码', trigger: 'blur'},
        {validator:this.validatorPhone}]}]" />
      </a-form-item>

      <a-form-item :wrapperCol="{span: 19, offset: 5}">
        <a-button type="primary" style="float: left" @click="prevStep">上一步</a-button>
        <a-button type="primary" style="float: right" @click="nextStep">下一步</a-button>
      </a-form-item>
    </a-form>
  </div>
</template>

<script>
  import JDate from '@/components/jeecg/JDate'
  import JCategorySelect from '@/components/jeecg/JCategorySelect'
  import JTreeSelect from '@/components/jeecg/JTreeSelect'
  import JAreaLinkage from '@comp/jeecg/JAreaLinkage'
  import ATextarea from "ant-design-vue/es/input/TextArea";
  import {downloadFile} from '@/api/manage'
  // 导入
  import JImageUpload from '@/components/jeecg/JImageUpload'
  import ACol from "ant-design-vue/es/grid/Col";
  export default {
    components:{
      ACol,
      ATextarea,
      JAreaLinkage,
      JTreeSelect,
      JImageUpload,
      JCategorySelect,
      JDate,
      JTreeSelect,
      downloadFile
    },
    props:{
      tes:{
        default:{},
        type: Object
      },
      isdisabledF:{
        default:0,
        type: Boolean
      }
    },
    created(){
      this.proInfo = this.tes;
    },
    mounted(){
      this.form.setFieldsValue({
        professorName:this.tes.professorName,
        professorSex:this.tes.professorSex,
        professorBirthday:this.tes.professorBirthday,
        professorEducationBackground:this.tes.professorEducationBackground,
        professorDegree:this.tes.professorDegree,
        professorAddress:this.tes.professorAddress,
        professorIdentity:this.tes.professorIdentity,
        professorHomeAddress:this.tes.professorHomeAddress,
        professorHealth:this.tes.professorHealth,
       professorOfficeTel:this.tes.professorOfficeTel,
       professorPhone:this.tes.professorPhone,
      });
    },
    name: "Step1",
    data(){
      return{
        labelCol: { span: 4 },
        wrapperCol: { span: 14 },
        fieldvalue:{
          professorName:'',
          professorSex:'',
          professorBirthday:'',
          professorIdentity:'',
          professorEducationBackground:'',
          professorDegree:'',
          professorAddress:'',
          professorHomeAddress:'',
          professorHealth:'',
          professorOfficeTel:'',
          professorPhone:'',
        },
        proInfo:{},
        majorId:"",
        schoolId:"",
        form:this.$form.createForm(this),
        imageUrl: '',
        model:{},
        validatorRules:{},
        url:"/sendToDing",
        downLoadUrl:'/professorInfo.xlsx',
        exportPdfUrl:"/org/exportProfessor/exportPDF",
        downloadPdfUrl:"/sys/common/static/",
      }
    },
    methods: {
      validatorPhone(rule, value, callback) {
        const phoneReg = /^[1][3,4,5,6,7,8,9][0-9]{9}$/
        if (!phoneReg.test(value)) {
          callback('请输入正确格式的手机号码')
        }
        callback();//必须调用，参数为空视为校验通过
      },
      validatorPhones(rule, value, callback) {
        const isPhone = /^1([38][0-9]|4[014-9]|[59][0-35-9]|6[2567]|7[0-8])\d{8}$/ //11位合法手机号码
        const isMob1 = /0\d{2,3}\d{7,8}/ //不带-的座机：02985111752
        const isMob2 = /^([0-9]{3,4}-)?[0-9]{7,8}$/ //带一个-：029-85111752
        const isMob3 = /^\d{3,4}-\d{3,4}-\d{3,4}$/; //带三个-： 0752-250-520
        if (isMob1.test(value) || isMob2.test(value) || isMob3.test(value) || isPhone.test(value)) {
          callback();
        } else {
          callback("请输入正确格式的手机号码或者座机号码")
        }
      },
      getfieldvalue(){
        const that = this;
        this.form.validateFields((err, values) => {
          // 获取表单中type的id
          this.fieldvalue.professorName = that.form.getFieldValue("professorName");
          this.fieldvalue.professorSex = that.form.getFieldValue("professorSex");
          this.fieldvalue.professorBirthday = that.form.getFieldValue("professorBirthday");
          this.fieldvalue.professorIdentity = that.form.getFieldValue("professorIdentity");
          this.fieldvalue.professorEducationBackground = that.form.getFieldValue("professorEducationBackground");
          this.fieldvalue.professorDegree = that.form.getFieldValue("professorDegree");
          this.fieldvalue.professorAddress = that.form.getFieldValue("professorAddress");
          this.fieldvalue.professorHomeAddress = that.form.getFieldValue("professorHomeAddress");
          this.fieldvalue.professorHealth = that.form.getFieldValue("professorHealth");
          this.fieldvalue.professorOfficeTel = that.form.getFieldValue("professorOfficeTel");
          this.fieldvalue.professorPhone = that.form.getFieldValue("professorPhone");
        })
      },
      nextStep () {
        const  identity=/^\d{6}(18|19|20)?\d{2}(0[1-9]|1[012])(0[1-9]|[12]\d|3[01])\d{3}(\d|[xX])$/
        const isPhone = /^1([38][0-9]|4[014-9]|[59][0-35-9]|6[2567]|7[0-8])\d{8}$/ //11位合法手机号码
        const isMob1 = /0\d{2,3}\d{7,8}/ //不带-的座机：02985111752
        const isMob2 = /^([0-9]{3,4}-)?[0-9]{7,8}$/ //带一个-：029-85111752
        const isMob3 = /^\d{3,4}-\d{3,4}-\d{3,4}$/; //带三个-： 0752-250-520
        this.getfieldvalue();
        if(!(Object.keys(this.fieldvalue).filter(v=>!this.fieldvalue[v]).length<=0)){
          this.$message.error("请仔细查看是否有未填项")
        }
        else if (!identity.test(this.fieldvalue.professorIdentity)){
          this.$message.error("请仔细检查身份证号码格式！")
        }
        else if(!isPhone.test(this.fieldvalue.professorPhone)){
          this.$message.error("请仔细检查手机电话号码格式！")
        }
        else if(!(isMob1.test(this.fieldvalue.professorOfficeTel) || isMob2.test(this.fieldvalue.professorOfficeTel) || isMob3.test(this.fieldvalue.professorOfficeTel) || isPhone.test(this.fieldvalue.professorOfficeTel))){
          this.$message.error("请仔细检查办公室电话号码格式！")
        }
        else {
          this.$emit('nextStep');
          this.$emit('setfiled',this.fieldvalue);
        }
      },
      prevStep () {
        this.getfieldvalue();
        if((Object.keys(this.fieldvalue).filter(v=>!this.fieldvalue[v]).length<=0)){
        this.$emit('prevStep')
        this.$emit('setfiled',this.fieldvalue);
        }else{
          this.$message.error("请仔细检查是否有未填写项！")
        }
      }
    }
  }
</script>

<style>
  .ant-form-item-label{
    padding-top: 5px !important;
  }
  .ant-col-4{
    width: 25% !important;
    text-align: center !important;
  }
  .ant-col-14{
    width: 70% !important;
  }
</style>